<template>
  <img
    v-if="item.extName === null || item.extName === ''"
    src="@/assets/images/file/dir.png"
    :title="`${item.isDir ? '' : '点击预览'}`"
    style="width: 30px; max-height: 30px; cursor: pointer"
    @click="handleFileNameClick(item)"
  />
  <img
    v-if="item.extName === 'doc' || item.extName === 'docx'"
    src="@/assets/images/file/file_word.svg"
    :title="`${item.isDir ? '' : '点击预览'}`"
    style="width: 30px; max-height: 30px; cursor: pointer"
    @click="handleFileNameClick(item)"
  />
  <img
    v-if="item.extName === 'xlsx' || item.extName === 'xls'"
    src="@/assets/images/file/file_excel.svg"
    :title="`${item.isDir ? '' : '点击预览'}`"
    style="width: 30px; max-height: 30px; cursor: pointer"
    @click="handleFileNameClick(item)"
  />
  <img
    v-if="item.extName === 'ppt' || item.extName === 'pptx'"
    src="@/assets/images/file/file_ppt.svg"
    :title="`${item.isDir ? '' : '点击预览'}`"
    style="width: 30px; max-height: 30px; cursor: pointer"
    @click="handleFileNameClick(item)"
  />
  <img
    v-if="item.extName === 'png' || item.extName === 'jpg'"
    src="@/assets/images/file/file_png.png"
    :title="`${item.isDir ? '' : '点击预览'}`"
    style="width: 30px; max-height: 30px; cursor: pointer"
    @click="handleFileNameClick(item)"
  />
</template>

<script setup>
import fileListPinia from "@/store/modules/fileList";

const store = fileListPinia();
const props = defineProps({
  item: {
    type: Object,
  },
});
function handleFileNameClick(row) {
  if (row.isDir === 1) {
    store.dirId = row.id;
  } else {
    window.open(`${store.lucyUrl}/disk/preview/${row.id}`, "_blank");
  }
}
</script>

<style>
</style>